
var _columns = [{checkbox: true},
    {field: 'id', title: '数据库ID'},
    {field: 'type', title: '类别'},
    {field: 'label', title: '标签'},
    {
        field : 'data',
        title : '控件图片',
        formatter:function(value,row,index){
            var s;
            if(row!=null){
                s = '<a><img style="width: 150px;" src ="'+ row.data.toString() +'" /></a>';
            }
            return s;
        },
    }
]

var TableInit = function () {
    var oTableInit = new Object();
    //初始化Table
    oTableInit.Init = function () {
        $('#data_table').bootstrapTable({
            url: '/component/select',               //请求后台的URL（*）
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber: 1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
            showColumns: true,                  //是否显示所有的列
            showRefresh: true,                  //是否显示刷新按钮
            clickToSelect: true,                //是否启用点击选中行
            uniqueId: "id",                     //每一行的唯一标识，一般为主键列
            search:true,
            columns: _columns,
        }).bootstrapTable('hideColumn','id');
    };

    //得到查询的参数
    oTableInit.queryParams = function (params) {
        var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            limit: params.limit,   //页面大小
            offset: params.offset,  //页码
            cname:companyName,
        };
        return temp;
    };
    return oTableInit;
};

var ButtonInit = function () {
    var oInit = {};
    oInit.Init = function () {
        //初始化页面上面的按钮事件

        $("#btn_add").click(function (){
            $('#id_controltype').val("add");
            $("#id_type").val("");
            $("#id_id").val("");
            $("#id_label").val("");
            $("#id_img").hide();
            $("#new_data").css("display","none");
        })

        $("#btn_edit").click(function() {
            var arrselections = $("#data_table").bootstrapTable('getSelections');
            if (arrselections.length > 1) {
                bootoast({
                    message: '只能选择一行进行编辑',
                    position: 'top',
                    type: 'warning',
                    timeout: 1.5,
                });
                return;
            }
            if (arrselections.length <= 0) {
                bootoast({
                    message: '请选择有效数据',
                    position: 'top',
                    type: 'warning',
                    timeout: 1.5,
                });
                return;
            }
            $('#id_controltype').val("edit");
            $('#id_label').val(arrselections[0]['label']);
            $('#id_id').val(arrselections[0]['id']);
            $('#id_type').val(arrselections[0]['type']);
            $('#new_data').modal();
            $('#id_img').attr("src",arrselections[0]['data']).show();
        });

        //新增/修改页面的提交按钮
        $('#new_data_submit').click(function (){
            let controltype = $('#id_controltype').val().toString();
            let id = $('#id_id').val();
            let label = $('#id_label').val().toString();
            let type = $("#id_type").val().toString();
            let data = $("#id_img")[0].src.toString();
            console.log(companyName);
                $.ajax({
                    type: "post",
                    url: "/component/insert",
                    data: JSON.stringify({
                        "controltype":controltype,
                        "id":id,
                        "label":label,
                        "type":type,
                        "data":data,
                        "companyName":companyName
                    }),
                    contentType: "application/json",
                    success: function (data) {
                        if (data['status'] === "success") {
                            bootoast({
                                message: '操作成功',
                                position: 'top',
                                type: 'success',
                                timeout: 1.5,
                            });
                            $("#data_table").bootstrapTable('refresh');
                        } else {
                            bootoast({
                                message: '操作失败\n' + data['status'],
                                position: 'top',
                                type: 'danger',
                                timeout: 1.5,
                            });
                        }
                    }
                });

        });

        //显示加载的图片(新增)
        $('#id_picture').change(function () {
            // 先获取用户上传的文件对象
            let fileObj = this.files[0];
            // 生成一个文件读取的内置对象
            let fileReader = new FileReader();
            // 将文件对象传递给内置对象
            fileReader.readAsDataURL(fileObj); //这是一个异步执行的过程，所以需要onload回调函数执行读取数据后的操作
            // 将读取出文件对象替换到img标签
            fileReader.onload = function(){  // 等待文件阅读器读取完毕再渲染图片
                $('#id_img').attr('src',fileReader.result).show();
            }
        });

        // 删除按钮
        $("#btn_delete").click(function () {
            var arrselections = $("#data_table").bootstrapTable('getSelections');
            var idList=[];
            if (arrselections.length <= 0) {
                bootoast({
                    message: '请选择有效数据',
                    position: 'top',
                    type: 'warning',
                    timeout: 1.5,
                });
                return;
            }
            for(var i=0;i<arrselections.length;i++){
                idList[i]=(arrselections[i].id);
            }

            bootbox.confirm({
                message: "确认要删除选择的数据吗？",
                locale: 'zh_CN',
                title: '操作提示',
                callback: function (result) {
                    if (result) {
                        $.ajax({
                            type: "post",
                            url: "/component/delete",
                            data: JSON.stringify(idList),
                            contentType: "application/json",
                            success: function (data) {
                                if (data['status'] === "success") {
                                    bootoast({
                                        message: '删除成功',
                                        position: 'top',
                                        type: 'success',
                                        timeout: 1.5,
                                    });
                                    $("#data_table").bootstrapTable('refresh');
                                } else {
                                    bootoast({
                                        message: '删除失败\n' + data['status'],
                                        position: 'top',
                                        type: 'danger',
                                        timeout: 1.5,
                                    });
                                }
                            }
                        });
                    }
                }
            })

        });

        //返回按钮
        $("#btn_return").click(function(){
            page_name = '工艺图库'
            page_url = "pages/craft_gallery.html"
            authName = "工艺流程/工艺图库"
            $('#page-wrapper').load('pages/technological_process.html');
        })

    };

    return oInit;
};

var hasPermission = function() {
    queryPermission('控件管理', '新增', 'btn_add')
    queryPermission('控件管理', '编辑', 'btn_edit')
    queryPermission('控件管理', '删除', 'btn_delete')
}

$(function () {

    //1.初始化Table
    var oTable = new TableInit();
    oTable.Init();

    // hasPermission();
    //2.初始化Button的点击事件
    var oButtonInit = new ButtonInit();
    oButtonInit.Init();
    $('#data_table').bootstrapTable('hideColumn', 'id');

});



